<div class="blade __animated">
  <div class="blade-wrapper">
    <header class="blade-head">
      <!--弹出层状态-->
      <div class="blade-status" [ngClass]="{'__error': blade.bladeData.error}">
        <!--{{blade.bladeData.error.message}}-->
        <div class="status-message" *ngIf="blade.bladeData.error">{{blade.bladeData.error}}</div>
        <div class="progress-bar __loaded" *ngIf="blade.bladeData.isLoading"></div>
      </div>
      <!--弹出层顶部按钮-->
      <div class="blade-nav">
        <ul class="menu __inline">
          <li class="menu-item __minimize" (click)="bladeRestore($event.target)" *ngIf="blade.bladeData.isMaximized">
            <button>最小化</button>
          </li>
          <li class="menu-item __maximize" (click)="bladeMaximize($event.target)" *ngIf="!blade.bladeData.isMaximized">
            <button>最大化</button>
          </li>
          <!--ng-disabled="blade.context.isClosingDisabled"-->
          <li class="menu-item __close" (click)="bladeClose($event.target)" [ngClass]="{'__disabled': blade.bladeData.isClosingDisabled}">
            <button>关闭</button>
          </li>
        </ul>
      </div>
      <!--弹出层标题-->
      <div class="blade-t" [ngClass]="{'__secondary': blade.bladeData.subtitle}">
          <!-- <i class="material-icons md-48">{{ blade.bladeData.headIcon ? blade.bladeData.headIcon:"star"}}</i> -->
        <i class="blade-t_ico fa {{blade.bladeData.headIcon == 'fa fa-user' ? '__customers' : ''}}" [ngClass]="blade.bladeData.headIcon ? blade.bladeData.headIcon : 'fa-folder'">
        </i>
        <p class="blade-t_head">{{blade.bladeData.title}}</p>
        <p class="blade-t_subhead">{{blade.bladeData.subtitle}}</p>
      </div>
      <!--弹出层工具条-->
      <div class="blade-toolbar">
        <ul class="menu __inline">
          <li class="menu-item" *ngFor="let command of blade.toolbarService.commands" [ngClass]="{'__disabled': !command.canExecuteMethod(blade)}"
            (click)='command.executeMethod(blade,$event)'>
            <button class="menu-btn" [disabled]="!command.canExecuteMethod(blade)">
            <i class="menu-ico" [ngClass]="command.icon"></i>
            {{ command.title }}
            </button>

            <p-fileUpload  *ngIf="command.upLoad" [ngClass]="{'fileUpload-edit':!file}" name="file" (uploadHandler)="onUpload($event)" (onRemove)="onRemove($event)"
            cancelLabel="取消" chooseLabel="上传" customUpload="true" auto="auto"></p-fileUpload>
          </li>
          
          
          <!--<li class="menu-item __more" (click)="showMoreTools($event)" *ngIf="1 > toolsPerLineCount">
            <a class="menu-btn">
              <i class="menu-ico fa fa-ellipsis-h"></i>
              更多
            </a>
          </li>-->
        </ul>
      </div>
    </header>
    <div class="loader" *ngIf="blade.bladeData.isLoading">
      <span></span>
      <span></span>
      <span></span>
      <span></span>
      <span></span>
    </div>
    <div class="blade-container __animated" [ngClass]="{'__loading': blade.bladeData.isLoading}">
      <ng-template app-blade-container-directive></ng-template>
    </div>
  </div>
</div>
